<template>
  <div class="special">
    <specl v-if="chanbool" :shuju="shuju"  />
    <spec2 v-else :shuju="shuju"  />
    <!-- 占位 -->
    <router-view />
    <!-- 切换页面 -->
    <van-pagination
      v-model="currentPage"
      :page-count="2"
      mode="simple"
      @change="xiayiye"
    />
  </div>
</template>

<script>
import {mapState,mapMutations} from "vuex"
import specl from "@/components/speci/spec1";
import spec2 from "@/components/speci/spec2";
import { GetSpecial } from "@/request/api";
export default {
  components: {
    specl,
    spec2,
  },
  data() {
    return {
      currentPage: 1,
      shuju: [],
     
    };
  },
  computed:{
...mapState({
   chanbool:state=>state.chanbool.chanbool
})
  },
  methods: {
     ...mapMutations({
            chanInbo:'chanbool/chanInbo'
        }),
    xiayiye() {
      console.log(this.chanbool);
       this.chanInbo(!this.chanbool)
      if (this.chanbool === false) {
        this.$toast.loading({
          overlay: true,
          duration: 100,
        });
        setTimeout(() => {
          GetSpecial({
            page: 2,
            size: 10,
          }).then((res) => {
            console.log(res.data);
            this.shuju = res.data.data;
            // this.$router.go(0)
          });
        }, 200);
      } else{
        this.$toast.loading({
          overlay: true,
          duration: 100,
        });
        setTimeout(() => {
          GetSpecial({
            page: 1,
            size: 10,
          }).then((res) => {
            console.log(res.data);
            this.shuju = res.data.data;
            // this.$router.go(0)
          });
        }, 200);
      }
    },
  },
  created() {
    GetSpecial({
      page: 1,
      size: 10,
    }).then((res) => {
      console.log(res.data);
      this.shuju = res.data.data;
    });
  },
};
</script>
 
<style lang = "less" scoped>
/deep/.van-pagination__page-desc {
  display: none;
}
.special {
  padding-bottom: 100px;
}
</style>